(function(){
    //轮播图插件
    function bannerMaker(bannerId,ajaxUrl){
        this.jsonData = null;
        this.num = -1;
        this.ajaxUrl = ajaxUrl;
        this.bannerId = bannerId;
        this.init();
    }

    bannerMaker.prototype = {
        constructor:bannerMaker,
        //获取json文件数据，存储在jsonData中
        getJson:function getJson(file){//file为txt文件的文件名

            var _this = this;
        var xhr = new XMLHttpRequest();
        xhr.open('get',file +'?_='+ Math.random(),false);
        xhr.onreadystatechange = function(){
            _this.jsonData = JSON.parse(xhr.responseText);
        }

        xhr.send(null);
        console.log(this.jsonData);

        },

        //设置图片src
        setImage:function setImage(){
        var images = this.bannerId.getElementsByTagName('img');
        var bks = this.bannerId.getElementsByClassName('bk');
        var timer = null;
        for(var i = 0;i < images.length ; i++){
            images[i].src = this.jsonData[i].src;
            
        }

        timer = window.setTimeout(function(){
            for(var i = 0;i < images.length ; i++){
                images[i].style.display = 'block';
                bks[i].style.background = 'url()';
                
            }
            images[0].style.zIndex = 1;
            images[0].style.opacity = 100;
            images[0].style.filter = 'opacity(100)';
            window.clearTimeout(timer);
        },200);
    },


    moveOneImg:function moveOneImg(){

        var _this = this;
        this.num++;
        var images = this.bannerId.getElementsByTagName('img');
        
        images[this.num].style.zIndex = '0';
        images[this.num].style.opacity = '0';
        if(this.num >= this.jsonData.length-1){
           this.num = -1;
        }else{
            
        }
        
        
            
            
        var timer = window.setInterval(function(){
            var curZindex= window.getComputedStyle(images[_this.num + 1],null).zIndex;
            var curop= window.getComputedStyle(images[_this.num + 1],null).opacity;
            console.log( curZindex,curop);
            var newIndex = 1;
            var newOpacity = parseFloat(window.getComputedStyle(images[_this.num + 1],null).opacity) + 0.1;
            console.log(newIndex,newOpacity);
            images[_this.num+1].style.zIndex = String(newIndex);
            images[_this.num+1].style.opacity = String(newOpacity);
            if(window.getComputedStyle(images[_this.num + 1],null).opacity == '1'){
                window.clearInterval(timer);
            }
        },200);
    },

    init:function init(){
        var _this = this;
        this.getJson(this.ajaxUrl);
        this.setImage();
    
    var timer = window.setInterval(function(){
        _this.moveOneImg();

    },2000);


    }




    }

    window.bannerMaker = bannerMaker;


})();